<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>样式</title>
		<!-- 内部样式：type可有可无 -->
		<style type="text/css">
			h3{
				color: green;/*字体颜色*/
				font-size: 28px;/*字体大小*/
				text-align: center;/*文本居中显示*/
			}
			p{
				color: blue;
			}
			.col{/*类选择器*/
				font-size: 36px;
			}
			#size{/*id选择器*/
				 color: green;
			}
			.font li,p,h3{
				color: red;
			}
			ol li{
				font-size: 24px;
			}
			</style>
			<!-- 关联外部样式：link标签 -->
			<link href="css/font-style.css" rel="stylesheet"/>
	</head>
	<body>
		<!-- css:层叠样式表又叫级联样式表 -->
	<!--引入样式：
		  1.内联样式：在标签中加入style属性
		  2.内部样式:在HTML文件中用style标签书写
		  3.外部样式：
		      step1:书写css文件样式
			  step2:在HTML文件中用link关联样式表
			  同时对一个标签作用内联样式，内部样式，外部样式时，样式采用的优先级，
			  内联样式优先级最高
			  内部样式和外部样式中谁距离标签更近谁优先
		选择器：
		   1.标签选择：选择标签
		   2.类选择：在结构中用class属性，在样式中用.类名
		   3.id选择: 在结构中用id属性，在样式中用#id名 
		  color:字体颜色
		  font：文字  size：大小  font-size：字体大小
		-->  
		<h2 style="color: aquamarine;font-size: 32px;">古诗中文网</h2>      <!--内联样式-->
		<h3 class="col">蒹葭</h3>
		<p class="col">蒹葭苍苍，白露为霜</p>
		<p class="col" id="size">所谓伊人，在水一方</p>
		<ul class="font">
			<li>首页</li>
			<li>商品详情</li>
		</ul>
		<ol>
			<li>前端应用</li>
			<li>选择</li>
		</ol>
	</body>
</html>
